<template>
	<view class="wx-popup" :hidden="flag" catchtouchmove="preventdefault">
		<view class="closeMask" @click="closeShow" :style="{'height':body+'rpx'}">

		</view>
		<view class='popup-toast'>
			<view class="showTop" @click="customerPopupShow = true">
				<!--<button open-type="contact">-->
        <button>
					<view class="text">在线客服</view>
          <view class="time">（工作日9:00-18:00）</view>
        </button>
      </view>
      <view class="hr"></view>
      <view class="showTop" @click="contactUs">
        <button>
          <view class="text">电话客服</view>
          <view class="time">（着急可拨打热线哦9:00-20:00）</view>
				</button>
			</view>
		</view>
    <u-popup :show="customerPopupShow" mode="center" @close="customerPopupShow = false" bg-color="transparent" :overlay-style="{backgroundColor: 'rgba(0, 0, 0, 0.8)'}">
      <view class="customer-popup-container" @click="customerPopupShow = false">
        <image class="customer-popup-img" :src="staticImgs.customQrcode" @click.stop show-menu-by-longpress  />
        <view class="customer-popup-text" @click.stop>长按识别</view>
      </view>
    </u-popup>
	</view>
</template>

<script>
	export default {
		props: {
      isExplanation: {
        type: Boolean,
        default: false
      }
		},
		data() {
			return {
				flag: true,
				body: 100,
        customerPopupShow: false,
        staticImgs: {
          customQrcode: this.imgBaseURL + '/customer/customer_qrcode.png?t=' + Math.random()
        }
			}
		},
		created() {
			var that = this;
			uni.getSystemInfo({
				success(res) {
					console.log(res);
					that.body = res.screenHeight * 2 - 300;
				}
			});
		},
		methods: {
			contactUs() {
				uni.makePhoneCall({
					phoneNumber: this.isExplanation ? '18701944814' : '15317081169'
				})
			},
			closeShow(e) {
				this.flag = true;
			},
			//展示弹框
			showPopup() {
				this.flag = false;
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("contactOursPop.css");
  .popup-toast {
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
  }
</style>
